<template>

  <el-tabs v-model="activeName" type="border-card" class="crud-tabs__card">
    <el-tab-pane
        v-for="(tab, idx) in tabs"
        :key="idx"
        :name="idx + ''"
        :label="tab.label"
    >
      <component
          :is="tab.component"
          v-if="activeName == idx"
          :ref="'c' + idx"
      ></component>
    </el-tab-pane>
  </el-tabs>

</template>

<script>
export default {
  components: {},
  data() {
    return {
      tabs: [
        {
          label: "告警处理分析",
          component: () => import("./count-tab-view/handle/index.vue"),
        },
        {
          label: "告警频次分析",
          component: () => import("./count-tab-view/frequency/index.vue"),
        },
      ],
      activeName: "0",
    };
  },
  computed: {},
  created() {
    let active = this.$route.query.activeMenu;
    this.activeName = active ?? "0";
  },
  methods: {},
};
</script>

<style lang="scss" scoped>
.crud-tabs__card{
  background: #e9eff7 !important;
  ::v-deep >.el-tabs__content{
    height: auto !important;
  }
}

</style>
